<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>列表</title>
    <link rel="stylesheet" href="../css/goodslist.css">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_2836455_ggxulrnzgpi.css">
    <script src="../js/jquery-1.11.3.js"></script>
    <script src="../js/goodslist.js"></script>
    <script src="../js/cookie.js"></script>

</head>

<body>
    <!-- 顶部 -->
    <div class="header_top">
        <div class="ui-ct">
            <!-- 左 -->
            <div class="header_top_left">

                <span class="tipsBar">
                    <span>欢迎来到网上商城！请</span>
                <a href="./login.html" class="logo">登录</a>
                <a href="./reg.html" class="logo">注册</a>
                </span>
            </div>
            <!-- 右 -->
            <div class="header_top_right">
                <ul>
                    <li>
                        网站导航
                    </li>
                    <li>
                        客户服务
                    </li>
                    <li>
                        手机商城
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- logo -->
    <div class="header_">
        <div class="header-sos">
            <div class="left">
                <a href="./home.html"><img src="http://images.400976.cn/images/77/20210616232653_36101.png" alt=""></a>
                <div class="hot_line">
                    <i class="iconfont icon icon-24gl-telephone2"></i>服务热线
                    <img src="http://www.400976.cn/static/contact/tel_img/77_header_4001366176.png" alt="">
                </div>
            </div>
            <div class="right">
                <div class="right_">
                    <i class="iconfont icon icon-fangdajing"></i>
                    <input type="text" name="" id="inp" placeholder="       请输入关键词">
                    <button id="btn">搜索</button>
                    <i class="iconfont icon icon-geren"></i>
                    <a href="shoppingcar.html"> <i class="iconfont icon icon-gouwuche"></i></a>
                </div>
            </div>
        </div>
    </div>
    <!-- 全部分类 -->
    <div class="nav">
        <div class="nav_">
            <a href="" class="active">全部产品分类</a>
            <a href="home.html">首页</a>
            <a href="goodslist.html">全部商品</a>
            <a href="javascript:;">资讯</a>
            <a href="javascript:;">问答</a>
            <a href="javascript:;">口碑</a>
        </div>
    </div>
    <!-- 位置 -->
    <div class="location">
        <div class="location_">
            <p>您现在的位置:</p>
            <a class="home" href="./home.html">首页</a>
            <i class="iconfont icon icon-xiangyoujiantou"></i>
            <a class="goodslist" href="./goodslist.html">全部商品</a>
        </div>
    </div>
    <!-- 产品分类 -->
    <div class="classify">
        <div class="classify_">
            <div class="top">
                <dl class="many-option-dl">
                    <dt>产品分类：</dt>
                    <dd class="many-option-dl-dd">
                        <a href="javascript:;" class="on">全部</a>

                        <a href="javascript:;" class="">面膜美白</a>

                        <a href="javascript:;" class="">彩妆美妆</a>

                        <a href="javascript:;" class="">精油纯露</a>

                        <a href="javascript:;" class="">脸部护理</a>

                        <a href="javascript:;" class="">美容院线</a>

                        <a href="javascript:;" class="">皮肤问题</a>

                        <a href="javascript:;" class="">微商产品</a>

                        <a href="javascript:;" class="">女性护理</a>

                        <a href="javascript:;" class="">护肤品</a>

                        <a href="javascript:;" class="">香水香氛</a>

                        <a href="javascript:;" class="">洗护用品</a>

                        <a href="javascript:;" class="">男士护肤</a>

                        <a href="javascript:;" class="">美妆工具</a>

                        <a href="javascript:;" class="">美容美体</a>

                        <a href="javascript:;" class="">身体护理</a>

                    </dd>
                </dl>
            </div>
            <div class="botton">
                <p>热门品牌:</p>
                <a href="">花姿嫚</a>
                <a href="">ooso</a>
                <a href="">蜜诗莜</a>
                <a href="">巧芙汀</a>
                <a href="">圣诗曼</a>
                <a href="">优尚臣</a>
                <a href="" class="active">展开</a>
            </div>

        </div>
    </div>
    <!-- 主体 -->
    <div class="conter">
        <div class="conter_">
            <div class="top">
                <a class="active" href="javascript:;">综合</a>
                <a href="javascript:;">销量</a>
                <a href="javascript:;">评价</a>
                <a href="javascript:;">最新</a>
            </div>
            <div class="mid">
                <!--中间主体部分sada -->
                <div class="list">
                    <!-- <div class="item">
                        <img src="../image/e2.JPG>
                    <p>商品名称</p>
                    <p>商品价格 商品数量</p> -->
                </div>
            </div>
            <div class="page">
                <button id="prev">上一页</button>

                <button id="home_page">
                    <i class="iconfont icon icon-daoshouye"></i>

                        </button>
                <div class="contain">

                </div>
                <input type="text" id="inp">

                <button id="trailer_page">
                    <i class="iconfont icon icon-daoweiye"></i>
                     </button>
                <button id="next">下一页</button>
                <button id="seek">搜索</button>

            </div>
        </div>



    </div>
    <!-- footer -->
    <div class="footer">
        <div class="footer_">
            <div class="top">
                <img src="../image/e1.JPG" alt="">
                <span>客服微信号</span>
                <img src="../image/e2.JPG" alt="">
                <span>公众号</span>
                <div class="qq">
                    <div class="left">
                        <p>商务QQ:</p>
                        <p>(服务时间周一至周六 9:00-20:00）</p>
                    </div>
                    <div class="right">
                        <p>服务热线：
                            <img class="dh" src="http://www.400976.cn/static/contact/tel_img/77_footer_4001366176.png" alt="">
                        </p>
                        <p>(服务时间周一至周六 9:00-20:00）</p>
                    </div>
                </div>
                <img src="../image/e1.JPG" alt="">
                <span>商务微信</span>
                <img src="../image/e2.JPG" alt="">
                <span>商务合作微信</span>
            </div>
            <div class="bottom">
                <div class="db">
                    <p>版权所有: 漂洋海淘 | Copyright 2009-2021 © Inc. All rights reserved.</p>
                    <p>ICP备案证书号：渝ICP备14009588号-38</p>
                    <p>重庆归农农业科技有限公司 版权所有</p>
                </div>
            </div>
        </div>
    </div>

</body>
<script>
    // 标识用户身份
    var tipsBar = document.getElementsByClassName("tipsBar")[0];


    var backurl = window.localStorage
    console.log(backurl);
    if (backurl) {
        var user = backurl.getItem("user");
        console.log(user);
        if (user) {
            tipsBar.innerHTML = `<span>欢迎您,${user}</span><button onclick="exit()">退出</button>`;
        }
    }

    function exit() {
        backurl.removeItem("user");
        location.reload();
    }
</script>

</html>